<template>
	<div class="member">
		<div class="boxs">
			<div class="box-tilte">待办事项</div>
			<el-card class="box-card" shadow="hover" v-if="memberReview">
				<div slot="header" class="clearfix">
					<img src="@/static/home/examine.png" class="imgH">
					<span>会员信息报送审核</span>
				</div>
				<div class="text-box" v-if="list">
					<!-- 审核普通会员等 -->
					<template v-for="item in list">
						<div class="item text" :key="item.id" :class="{
							'blue': item.orgAttrCode == '01' || item.orgAttrCode == '04',
							'green': item.orgAttrCode == '02' || item.orgAttrCode == '05',
							'red': item.orgAttrCode == '03',
						}" @click="goPage(item)" v-if="item.show">
							<div class="info">{{ item.dictNameResult && item.dictNameResult.orgAttrCode }}</div>
							<div class="num">{{ item.countNum }}</div>
						</div>
					</template>
					<!-- 审核财务数据 -->
					<template v-for="item in financeToDoList">
						<div class="item text" :key="item.id" :class="{
							'blue': item.type == '定期报告',
							'green': item.type == '自律报表',
							'red': item.type == '年度报告',
						}" @click="goPage(item)" v-if="item.show">
							<div class="info">{{ item.type }}</div>
							<div class="num">{{ item.countNum }}</div>
						</div>
					</template>
				</div>
			</el-card>

			<el-card class="box-card" shadow="hover" v-if="mediationBusiness">
				<div slot="header" class="clearfix">
					<img src="@/static/home/pass.png" class="imgH">
					<span>调解工作系统业务</span>
				</div>
				<div class="text-box">
					<template v-for="item in list1">
						<div class="item text" :class="item.class" :key="item.id" v-if='item.show'
							@click="gomediatePage(item)">
							<div class="info">{{ item.name }}</div>
							<div class="num">{{ item.num }}</div>
						</div>
					</template>
				</div>
			</el-card>
			<el-card class="box-card" shadow="hover" v-if="memberSubmission">
				<div slot="header" class="clearfix">
					<img src="@/static/home/nopass.png" class="imgH">
					<span>会员信息报送</span>
				</div>
				<div class="text-box">
					<template v-for="item in list3">
						<div class="item text" :key="item.id" :class="{
							'blue': item.infsubAuditStatusCode == '02',
							'green': item.infsubAuditStatusCode == '05',
							'red': item.infsubAuditStatusCode == '06' || item.infsubAuditStatusCode == '07',
						}" @click="showInfo(item)" v-if='item.show'>
							<div class="info">{{ item.dictNameResult && item.dictNameResult.infsubAuditStatusCode }}
							</div>
							<div class="num">{{ item.countNum }}</div>
						</div>
					</template>
				</div>
			</el-card>
			<el-card class="box-card" shadow="hover" v-if="bondBusiness">
				<div slot="header" class="clearfix">
					<img src="@/static/home/nopass.png" class="imgH">
					<span>债券承销业务</span>
				</div>
				<div class="text-box">
					<template v-for="item in list4">
						<div class="item text" :key="item.id" :class="item.class" @click="goBondPage(item)"
							v-if="item.show">
							<div class="info">{{ item.name }}</div>
							<div class="num">{{ item.num }}</div>
						</div>
					</template>
				</div>
			</el-card>
		</div>
		<div class="annouBox">
			<div class="box">
				<div class="box-tilte mar">系统公告</div>
				<div class="scroll">
					<div class="lists">
						<div class="annu-top" v-for="item in annuList" :key="item.id">
							<div class="icon"></div>
							<div class="annu-title" @click="pubntcitem(item)">{{ item.pubntcName }}</div>
							<div class="new">new！</div>
							<div class="annu-date">{{ item.pubntcRlsTime }}</div>
						</div>
						<!-- <div class="annu-top" v-for="item in magzList" :key="item.id">
							<div class="icon"></div>
							<div class="annu-title" @click="magzitem(item)">
								<span>{{ item.year }}年</span>
								<span>{{ getPerd(item.perd) }}</span>
							</div>
							<div class="new">new！</div>
							<div class="annu-date">{{ item.rlsTime }}</div>
						</div> -->
					</div>
				</div>
			</div>
			<!-- <div class="box">
				<div class="box-tilte mar">在线消息</div>
				<div class="scroll">
					<div class="lists">
						<div class="annu-top" v-for="item in messageList" :key="item.id">
							<div class="icon"></div>
							<div class="annu-title">{{ item.title }}</div>
							<div class="new">new！</div>
							<div class="annu-date">{{ item.date }}</div>
						</div>
					</div>
				</div>
			</div> -->
			<div class="box">
				<div class="box-tilte mar">到期提醒</div>
				<div class="scroll">
					<div class="lists">
						<div class="annu-top" v-for="item in remindList" :key="item.id">
							<div class="icon"></div>
							<div class="annu-title">
								您本年度会费将于
								<span style="color: red;">{{ item.date }}</span>
								到期,请尽快缴纳下个年度会费!
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="box">
				<div class="box-tilte mar">会员档案查询</div>
				<div class="scroll">
					<div class="borderDiv">
						<el-form ref="form" :model="form" label-width="60px">
							<el-row>
								<el-col :span="9">
									<el-form-item label="会员号">
										<el-select v-model="form.code" placeholder="请选择">
											<el-option v-for="item in options" :key="item.name" :label="item.name"
												:value="item.code">
											</el-option>
										</el-select>
									</el-form-item>
								</el-col>
								<el-col :span="11" style='margin-left:5px;margin-top: 2px' v-if="form.code == '01'">
									<el-input v-model="form.orgCode" placeholder="请输入会员号"></el-input>
								</el-col>
								<el-col :span="11" style='margin-left:5px;margin-top: 2px'
									v-else-if="form.code == '02'">
									<el-input v-model="form.aoiOrgNo" placeholder="请输入统一社会信息代码"></el-input>
								</el-col>
								<el-col :span="11" style='margin-left:5px;margin-top: 2px'
									v-else-if="form.code == '03'">
									<el-input v-model="form.orgName" placeholder="请输入单位名称"></el-input>
								</el-col>
								<el-col :span="3">
									<div class="btndiv">
										<el-button v-blur class="query" @click="search">搜索</el-button>
									</div>
								</el-col>
							</el-row>
						</el-form>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
import api from '@/api/home/home.js'
export default {
	name: 'Member',
	props: {
		msg: String
	},
	data() {
		return {
			memberReview: false,
			mediationBusiness: false,
			memberSubmission: false,
			bondBusiness: false,
			form: {
				code: '01', //下拉选择
				orgCode: '', //会员代码
				aoiOrgNo: '', //统一社会信用代码
				orgName: '', //会员名称
			},
			options: [],
			list: [],
			list1: [{
				id: 1,
				name: '调解申请审核',
				num: 0,
				class: 'blue',
				show: false
			},
			{
				id: 2,
				name: '纠纷转办待确认',
				num: 0,
				class: 'green',
				show: false
			},
			{
				id: 3,
				name: '普通调解申请审核',
				num: 0,
				class: 'red',
				show: false
			},
			{
				id: 4,
				name: '借调申请审核',
				num: 0,
				class: 'blue',
				show: false
			},
			{
				id: 5,
				name: '修改调解员审核申请',
				num: 0,
				class: 'green',
				show: false
			},
			{
				id: 6,
				name: '延长调解期限审核',
				num: 0,
				class: 'red',
				show: false
			},
			{
				id: 7,
				name: '普通调解处理审核',
				num: 0,
				class: 'red',
				show: false
			},
			],
			list3: [],
			list4: [{
				id: 18,
				name: '受托退回修改',
				num: 0,
				class: 'green',
				show: false
			},
			{
				id: 19,
				name: '牵头退回修改',
				num: 0,
				class: 'red',
				show: false
			},
			{
				id: 20,
				name: '联席退回修改',
				num: 0,
				class: 'blue',
				show: false
			},
			],
			annuList: [], //公告数据
			magzList: [], //杂志数据
			perData: [], //期数数据
			remindList: [],//到期提醒
			messageList: [],
			financeToDoList: [],
		}
	},
	mounted() {
		this.$publicApi.queryDictCommonBatchResult('DG0467,DG0545').then(res => {
			this.options = res.data.data[0].DG0467
			//获取《中国证券》专栏期数
			this.perData = res.data.data[0].DG0545
		})
		this.getMemList();
		this.getAuditList();
		this.getFinanceList();
		this.getmediateList();
		// this.getAnnuList();
		// this.getMagzList();
		//获取系统公告
		this.getSystemPublic()
		this.remindMem();
		this.getBondList()
		this.getSysRemindMenu()
	},
	methods: {
		//获取资源展示信息
		getSysRemindMenu() {
			api.getSysRemindMenu().then(res => {
				//会员信息报送审核(会员)
				if (res.data.auResourcesMember.length > 0) {
					this.memberReview = true
					if (res.data.auResourcesMember[0].children[1].children) {
						for (let i = 0; i < res.data.auResourcesMember[0].children[1].children.length; i++) {
							this.list.map(item => {
								if (item.dictNameResult.orgAttrCode == res.data.auResourcesMember[0].children[1].children[i].menuName) {
									item.show = true
								}
							})
						}
					}
				}

				//会员信息报送审核(财务数据)
				if (res.data.auResourcesMember.length > 0) {
					this.memberReview = true
					if (res.data.auResourcesMember[0].children[1].children[4]) {
						for (let i = 0; i < res.data.auResourcesMember[0].children[1].children[4].children.length; i++) {
							this.financeToDoList.map(item => {
								if (item.type == res.data.auResourcesMember[0].children[1].children[4].children[i].menuName) {
									item.show = true
								}
							})
						}
					}
				}
				//调解展示
				if (res.data.auResourcesMediat.length > 0) {
					this.mediationBusiness = true
					for (let i = 0; i < res.data.auResourcesMediat.length; i++) {
						this.list1.map(item => {
							if (item.name == res.data.auResourcesMediat[i].menuName) {
								item.show = true
							}
						})
					}
				}

				//会员信息报送
				if (res.data.auResourcesMember.length > 0) {
					this.memberSubmission = true
					if (res.data.auResourcesMember[0].children[0].children) {
						for (let i = 0; i < res.data.auResourcesMember[0].children[0].children.length; i++) {
							this.list3.map(item => {
								if (item.dictNameResult.infsubAuditStatusCode == res.data.auResourcesMember[0].children[0].children[i].menuName) {
									item.show = true
								}
							})
						}
					}
				}

				//债券承销业务
				if (res.data.auResourcesFixIncome.length > 0) {
					this.bondBusiness = true
					for (let i = 0; i < res.data.auResourcesFixIncome.length; i++) {
						if (res.data.auResourcesFixIncome[i].menuName == "债券承销信息报送(独主/牵头)") {
							this.list4[1].show = true
						} else if (res.data.auResourcesFixIncome[i].menuName == "债券承销信息报送(联席/主承)") {
							this.list4[2].show = true
						} else if (res.data.auResourcesFixIncome[i].menuName == "债券承销信息报送(受托管理人)") {
							this.list4[0].show = true
						}
					}
				}


			})
		},
		//债券承销数据
		getBondList() {
			api.bondStatusStatistics().then(res => {
				if (res.data && res.data.code == 200) {
					if (res.data.data) {
						this.list4[0].num = res.data.data.trusteStatusNum;
						this.list4[1].num = res.data.data.busiStatusNum;
						this.list4[2].num = res.data.data.mtjoinStatusNum;
					}
				}
			})
		},
		//协会数据  法定会员
		getAuditList() {
			api.auditSecToDoList().then(res => {
				if (res.data && res.data.code == 200) {
					if (res.data.data) this.list = res.data.data;
					for (let i = 0; i < this.list.length; i++) {
						this.list[i].show = false
					}
				}
			})
		},
		//机构数据
		getMemList() {
			let id = sessionStorage.getItem('orgUserNo');
			api.backLogToDoList(id).then(res => {
				if (res.data && res.data.code == 200) {
					if (res.data.data) this.list3 = res.data.data;
					for (let i = 0; i < this.list3.length; i++) {
						this.list3[i].show = false
					}
				}
			})
		},
		//财务数据
		getFinanceList() {
			api.financeToDoList().then(res => {
				if (res.data && res.data.code == 200) {
					if (res.data.data) this.financeToDoList = res.data.data;
					for (let i = 0; i < this.financeToDoList.length; i++) {
						this.financeToDoList[i].show = false
					}
				}
			})
		},
		//获取调解审核数量查询
		getmediateList() {
			api.MediationApplicationStatisticsCount().then(res => {
				if (res.data && res.data.code == 200) {
					if (res.data.data.length > 0) {
						const data = res.data.data[0]
						this.list1[0].num = data.queryMedtBscExamine //调解申请审核
						this.list1[1].num = data.disputesConfirmedCount //纠纷转办待确认  
						this.list1[2].num = data.ordinaryMediationExamineCount //普通调解申请审核
						this.list1[3].num = data.secondmentMediationApproverCount //借调审核
						this.list1[4].num = data.updateVerifCount //修改调解员申请审核
						this.list1[5].num = data.extensionExamineCount // 延长调解期限审核
						this.list1[6].num = data.ordinaryMediationHandleExamineCount //普通调解处理审核
					}
				}
			})
		},
		//系统公共
		getSystemPublic() {
			api.homeSystemBulletin().then(res => {
				this.annuList = res.data.data
			})
		},
		//公告数据
		// getAnnuList() {
		// 	const data = {
		// 		"pageNum": 1,
		// 		"pageSize": null,
		// 		"param": {
		// 			"userName": "", //发布机构
		// 			"pubntcName": "", //公告名称
		// 			"pubntcRlsTimeStart": "", //创建开始时间
		// 			"pubntcRlsTimeEnd": "" //创建结束时间
		// 		}
		// 	}
		// 	api.viewAnnouncementList(data).then((res) => {
		// 		this.annuList = res.data.data
		// 	})
		// },
		// //《中国证券》数据
		// getMagzList() {
		// 	const data = {
		// 		"pageNum": 1,
		// 		"pageSize": null,
		// 		"param": {
		// 			"year": "", //年份form.perd
		// 			"perd": "", //期数
		// 		}
		// 	}
		// 	api.chisecMagzList(data).then((res) => {
		// 		this.magzList = res.data.data
		// 	})
		// },
		getPerd(perd) {
			for (let i in this.perData) {
				let item = this.perData[i]
				if (item.code == perd) {
					return item.name
				}
			}
		},
		//点击某条公告数据
		pubntcitem(item) {
			this.$router.push({
				path: '/releaseNoticeInfo',
				query: {
					id: item.pubntcInfoNo
				}
			})
		},
		//点击某条《中国证券》数据
		magzitem(item) {
			this.$router.push({
				path: '/consultLook',
				query: {
					id: item.id
				}
			})
		},
		//点击审批通过不通过，展示列表
		showInfo(item) {
			this.$router.push({
				name: 'association',
				params: {
					infsubAuditStatusCode: item.infsubAuditStatusCode,
				}
			})
			console.log(item.dictNameResult.infsubAuditStatusCode)
			this.$sendEvent('router', {
				resourceUrl: '/association',
				menuName: item.dictNameResult.infsubAuditStatusCode
			})
		},
		//会员会费到期提醒
		remindMem() {
			api.remindPayTask().then(res => {
				if (res.data && res.data.code == 200) {
					if (res.data.length > 0) {
						this.remindList = [
							{ name: '会员会费到期提醒', date: res.data.data[0].memExpirationTime }
						]
					}
				}
			})
		},
		search() {
			if (this.form.code == '01') {
				if (this.form.orgCode) {
					this.pushUrl();
				} else {
					this.$message.error('请输入会员号')
				}
			} else if (this.form.code == '02') {
				if (this.form.aoiOrgNo) {
					this.pushUrl();
				} else {
					this.$message.error('请输入统一社会信用代码')
				}
			} else if (this.form.code == '03') {
				if (this.form.orgName) {
					this.pushUrl();
				} else {
					this.$message.error('请输入单位名称')
				}
			}
			this.$sendEvent('router', {
				resourceUrl: '/infoMaintenance',
				menuName: '会员档案信息维护'
			})
		},
		pushUrl() {
			this.$router.push({
				name: 'infoMaintenance',
				params: {
					orgCode: this.form.orgCode,
					aoiOrgNo: this.form.aoiOrgNo,
					orgName: this.form.orgName,
				}
			})
		},
		goPage(item) {
			if (item.dictNameResult.orgAttrCode == '普通会员') {
				this.$router.push('/ordinaryMember');
				this.$sendEvent('router', {
					resourceUrl: '/ordinaryMember',
					menuName: '普通会员'
				})
			} else if (item.dictNameResult.orgAttrCode == '法定会员') {
				this.$router.push('/legalMember')
				this.$sendEvent('router', {
					resourceUrl: '/legalMember',
					menuName: '法定会员'
				})
			} else if (item.dictNameResult.orgAttrCode == '特别会员') {
				this.$router.push('/specialMember')
				this.$sendEvent('router', {
					resourceUrl: '/specialMember',
					menuName: '特别会员'
				})
			} else if (item.dictNameResult.orgAttrCode == '观察员') {
				this.$router.push('/observer')
				this.$sendEvent('router', {
					resourceUrl: '/observer',
					menuName: '观察员'
				})
			} else if (item.type == '定期报告') {
				this.$router.push('/periodicReportReview')
				this.$sendEvent('router', {
					resourceUrl: '/periodicReportReview',
					menuName: '定期报告'
				})
			} else if (item.type == '自律报表') {
				this.$router.push('/selfReportReview')
				this.$sendEvent('router', {
					resourceUrl: '/selfReportReview',
					menuName: '自律报表'
				})
			} else if (item.type == '年度报告') {
				this.$router.push('/annualReportReview')
				this.$sendEvent('router', {
					resourceUrl: '/annualReportReview',
					menuName: '年度报告'
				})
			}
		},
		gomediatePage(item) {
			if (item.name == '纠纷转办待确认') {
				this.$router.push({
					name: 'disputeConfirm',
					params: {
						infsubAuditStatusCode: '12',
					}
				})
				this.$sendEvent('router', {
					resourceUrl: '/disputeConfirm',
					menuName: '纠纷转办确认'
				})
			} else if (item.name == '调解申请审核') {
				// this.$router.push('/geltenExamine')
				this.$router.push({
					name: 'geltenExamine',
					params: {
						infsubAuditStatusCode: '02',
						flowStepNo: '02'
					}
				})
				this.$sendEvent('router', {
					resourceUrl: '/geltenExamine',
					menuName: '调解申请审核'
				})
			} else if (item.name == '普通调解申请审核') {
				// this.$router.push('/ordinarysApply')
				this.$router.push({
					name: 'ordinarysApply',
					params: {
						infsubAuditStatusCode: '02',
						flowStepNo: '11'
					}
				})
				this.$sendEvent('router', {
					resourceUrl: '/ordinarysApply',
					menuName: '普通调解申请审核'
				})
			} else if (item.name == '借调申请审核') {
				// this.$router.push('/loanExamine')
				this.$router.push({
					name: 'loanExamine',
					params: {
						infsubAuditStatusCode: '02',
						flowStepNo: '20'
					}
				})
				this.$sendEvent('router', {
					resourceUrl: '/loanExamine',
					menuName: '借调申请审核'
				})
			} else if (item.name == '修改调解员申请审核') {
				this.$router.push('/modifinApplication')
				this.$sendEvent('router', {
					resourceUrl: '/modifinApplication',
					menuName: '修改调解员申请审核'
				})
			} else if (item.name == '延长调解期限审核') {
				this.$router.push('/deadlineReview')
				this.$sendEvent('router', {
					resourceUrl: '/deadlineReview',
					menuName: '延长调解期限审核'
				})
			} else if (item.name == '普通调解处理审核') {
				this.$router.push({
					name: 'ordinaryExamine',
					params: {
						infsubAuditStatusCode: '02',
					}
				})
				this.$sendEvent('router', {
					resourceUrl: '/ordinaryExamine',
					menuName: '普通调解处理审核'
				})
			}
		},
		goBondPage(item) {
			console.log(item, 'item')
			if (item.name == '牵头退回修改') {
				this.$router.push('/headedSubmitted')
				this.$sendEvent('router', {
					resourceUrl: '/headedSubmitted',
					menuName: '牵头退回修改'
				})
			} else if (item.name == '受托退回修改') {
				this.$router.push('/entrustedSubmitted')
				this.$sendEvent('router', {
					resourceUrl: '/entrustedSubmitted',
					menuName: '受托退回修改'
				})
			} else if (item.name == '联席退回修改') {
				this.$router.push('/jointSubmitted')
				this.$sendEvent('router', {
					resourceUrl: '/jointSubmitted',
					menuName: '联席退回修改'
				})
			}
		}
	}
}
</script>

<style scoped lang="scss">
.welcome {
	text-align: left;
}

.boxs {
	z-index: 2;
}

.box-tilte {
	font-size: 16px;
	font-family: PingFang SC;
	font-weight: bold;
	color: #333333;
}

.mar {
	margin-top: 12px;
	margin-bottom: 12px;
}

.item {
	min-width: 195px;
	height: 40px;
	background: rgba(61, 175, 255, .1);
	border-radius: 5px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-align: center;
	margin: 5px 10px;
	padding: 10px;
	box-sizing: border-box;

	&:nth-child(7n+1) {
		margin-left: 0;
	}

	&:nth-child(7n) {
		margin-right: 0;
	}
}

.img {
	width: 30px;
	height: 30px;
	margin: 0 25px;
}

.num {
	font-size: 20px;
	font-weight: bold;
	cursor: pointer;

}

.info {
	font-size: 12px;
	font-family: PingFang SC;
	// font-weight: bold;
	color: #333333;
}

.infoo {
	margin-top: 10px;
	font-size: 20px;
	font-family: PingFang SC;
	font-weight: bold;
	color: #333333;
}

.blue {
	color: #3D7FFF;
	cursor: pointer;
}

.green {
	background-color: rgba(31, 192, 186, .1);
	color: #1FC0BA;
	cursor: pointer;
}

.red {
	background-color: rgba(255, 90, 90, .1);
	color: #FF5A5A;
	cursor: pointer;
}

.black {
	background: rgba(61, 175, 255, 0);
	cursor: pointer;

}

.yellow {
	background-color: rgba(255, 168, 0, .1);
	color: #FFA800;
	cursor: pointer;
}

.annouBox {
	display: flex;
	justify-content: space-between;
	margin-top: 22px;
	flex-wrap: wrap;

}

.box {
	width: 48%;
}

.annu-top {
	display: flex;
	align-items: center;
	margin-bottom: 15px;
	position: relative;

	&:last-child {
		margin-bottom: 0;
	}
}

.icon {
	width: 4px;
	height: 4px;
	background: #3D7FFF;
	border: 1px solid #3D7FFF;
	border-radius: 50%;
	margin-right: 10px;
}

::-webkit-scrollbar {
	display: none;
}

.lists {
	overflow-y: auto;
	height: 215px;
}

.scroll {
	padding: 15px;
	background: linear-gradient(180deg, #F4F8FF 0%, #EBF2FF 100%);
	border-radius: 10px;
}

.annu-title {
	font-size: 14px;
	font-family: PingFang SC;
	font-weight: bold;
	color: #333333;
	cursor: pointer;
}

.annu-date {
	font-size: 14px;
	font-family: PingFang SC;
	color: #333333;
	position: absolute;
	top: 0;
	right: 0;
}

.new {
	width: 34px;
	height: 16px;
	line-height: 16px;
	text-align: center;
	// background: rgba(255, 195, 90, .3);
	border-radius: 8px;
	font-size: 9px;
	font-family: PingFang SC;
	font-weight: bold;
	color: #FFA800;
	margin-left: 5px;
}

.btndiv {
	position: relative;
	left: 0;
	bottom: 2px;
}

.borderDiv {
	height: 215px;
	display: flex;
	align-items: center;
}

.text-box {
	display: flex;
	flex-wrap: wrap;
}

/deep/.el-card__header {
	padding: 10px 10px 5px;
	font-size: 16px;
	font-weight: 600;
	border-bottom: 0;
}

/deep/.el-card__body {
	padding: 0 10px 10px
}

.imgH {
	width: 24px;
	height: 24px;
	vertical-align: middle;
	margin-right: 10px;
}

.box-card {
	width: calc(100% - 4px);
	margin-top: 10px;
}

/deep/.el-card {
	border: 1px solid rgba(61, 175, 255, .1);
	border-radius: 10px;
}

/deep/.el-form {
	width: 100%;
}
</style>
